<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
  <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
  <meta name="format-detection" content="telephone=no" />
  <title>认证绑卡</title>
  <link rel="stylesheet" href="../../css/reset.css" />
  <style>
    body {
      width: 100%;
      background-color: #fff;
      font-size: 0.26rem;
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      font-family: Helvetica;
      color: #333333;
      height: auto;
    }

    .uppicture {
      width: 100%;
      display: flex;
      display: -webkit-flex;
      flex-direction: column;
      align-items: center;
    }

    .uppicture div {
      margin-bottom: 0.35rem;
    }

    .nextbutton {
      width: 6.84rem;
      height: 0.9rem;
      line-height: 0.9rem;
      text-align: center;
      background-color: #ffd203;
      outline: none;
      border: none;
      border-radius: 0.1rem;
      margin-left: calc((100% - 6.84rem) / 2);
    }

    .tips {
      height: 1rem;
      line-height: 1rem;
      width: 100%;
      padding: 0 0.3rem;
      box-sizing: border-box;
    }
  </style>
</head>

<body>
  <p class="tips">请上传手持身份证原件正面和个人签字</p>
  <div class="uppicture" data-flag="idCardfront">
    <div>
      <img src="../../image/userx.png" alt="" style="width:5.16rem;height: 3.44rem;" id="idCardfront" data-path="" />
    </div>
    <div>
      <p style="padding: 0 0.24rem">
        请上传一张手持身份证原件正面照和个人手写的照片，个人手写的内容包含“人人矿场”和“当前日期”，<br />
        请确保照片和个人手写的内容清晰，仅支持JPG和PNG图片格式，图片大小小于2M。
      </p>
    </div>
  </div>

  <button class="nextbutton">下一步</button>

  <script src="../../script/autosize.js"></script>
  <script src="../../script/jquery_three_two_one.js"></script>
  <script src="../../script/app.js"></script>
  <script>
    apiready = function () {
      var app = new APP();
      var pictrueFront = api.pageParam.front;
      var pictrueResever = api.pageParam.reverse;
      var imgWidth = app.W * 0.9;
      var imgHeight = app.accDiv(imgWidth, 1.58);
      var typeChoose = "idCardfront";

      function openPirtrue(thiz) {
        app.sheet({
          buttons: ["拍照", "相册"],
          cancelTitle: "取消"
        }, function (ret, err) {
          app.trigger("selectPic");
          var index = ret.buttonIndex;
          app.log("index", index);
          if (index == 1) {
            //拍照
            app.shootPic(function (ret, err) {
              app.log("shoot", ret);
              // 图片裁剪
              if (ret && ret.data) {
                app.openImgHandle({
                  type: typeChoose,
                  flag: $(thiz).data("flag"),
                  srcPath: ret.data,
                  dimension: [imgWidth, imgHeight]
                });
              }
            });
            return;
          }
          if (index == 2) {
            //相册
            app.getPic(function (ret, err) {
              app.log("get", ret);
              // 图片裁剪
              if (ret && ret.data) {
                app.openImgHandle({
                  type: typeChoose,
                  flag: $(thiz).data("flag"),
                  srcPath: ret.data,
                  dimension: [imgWidth, imgHeight]
                });
              }
            });
          }
        }
        );
      }
      $(".uppicture").click(function () {
        var thiz = this;
        typeChoose = "idCardreverse";
        openPirtrue(thiz);
      });

      app.listen("compress_image_success", function (ret, err) {
        app.log("压缩事件chankan", JSON.stringify(ret));
        // app.log("压缩事件", ret.value.imgUrl);
        if (ret.value.flag && ret.value.imgUrl) {
          var retCopy = ret;
          // 上传图片
          var account = app.getAccount();
          // 开始转菊花
          app.upload({
            param: {
              method: "post",
              url: app.ajaxUrl + "upload/img",
              data: {
                values: {
                  uid: account.uid,
                  token: account.token
                },
                files: {
                  "DynamicModel[file]": ret.value.imgUrl
                }
              },
              callback: function (ret, err) {
                console.log("图片查看地址" + JSON.stringify(ret));
                if (ret.files && ret.files.length > 0) {
                  $("#" + retCopy.value.flag).data("path", ret.files[0].path).attr("src", ret.files[0].url);
                } else {
                  app.toast(desc);
                }
              }
            },
            extra: {
              isflower: true,
              flowerParam: {
                msg: "正在上传...",
                delay: 500
              }
            }
          });
        }
      });
      $(".nextbutton").on("click", function () {
        if ($("#idCardfront").data("path") == "") {
          app.toast("请上传手持签名照片");
          return;
        }
        var account = app.getAccount();
        app.ajax({
          param: {
            method: "post",
            url: app.ajaxUrl + "member/sumitRealnameVerify",
            data: {
              values: {
                uid: account.uid,
                token: account.token,
                name: api.pageParam.userName,
                id_num: api.pageParam.userCardNumber,
                id_photo_1: pictrueFront,
                id_photo_2: pictrueResever,
                id_photo_3: $("#idCardfront").data("path")
              }
            },
            callback: function (ret, err) {
              app.log("auth", "提交返回：" + JSON.stringify(ret));
              if (ret.code == 200) {
                // 发送认证成功提交成功消息
                app.toast("上传成功");
                app.trigger("auth_commit_success");
                // 刷新页面
              } else {
                app.toast(ret.message);
              }
            }
          },
          extra: {
            isflower: true
          }
        });
      });
      app.headerMap();
      app.listen("goMain", function () {
        app.closeW();
      })
    };
  </script>
</body>

</html>